<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8" trimDirectiveWhitespaces="true"%>
<!DOCTYPE html>
<html>
<head>
<title>大数据新闻</title>
<%@ include file="/WEB-INF/views/include.inc.jsp"%>
</head>
<body class="page-index">
<c:import url="/layout/header?columnId=${columnId }&tag=shadow"/>
<div class="main1 main1-center2">
  <div class="info">
    <h2>我们设计 我们开发 我们有数据市场</h2>
    <h2>前沿 优秀 智慧 大量</h2>
    <button id="main1-btn" class="btn">马上体验</button>
  </div>
</div>
<div class="news">
  <div class="container">
    <div class="row">
      <div class="col-xs-9">
	    <page:paginationForm action="${contextPath }/article/list/${columnId }" page="${page }">
	    </page:paginationForm>
	    <c:forEach var="article" items="${articles }">
          <div class="media">
            <div class="media-left">
              <a href="${contextPath }/article/view/${article.id}" target="_blank">
                <c:if test="${empty article.url}">
                  <img class="media-object" src="${contextPath }/styles/dsj/images/news8.jpg">
                </c:if>
                <c:if test="${not empty article.url}">
                  <img class="media-object" src="${contextPath }${article.url }" style="width:260px;height:170px;">
                </c:if>
              </a>
            </div>
            <div class="media-body">
              <a class="media-heading" href="${contextPath }/article/view/${article.id}" target="_blank">${article.title }</a>
              <p class="media-simple">${article.desc }</p>
              <div class="footer">
                <span class="author">${article.author }</span>
                <span><fmt:formatDate value="${article.createTime }" pattern="yyyy-MM-dd HH:mm" /></span>
              </div>
            </div>
          </div>
        </c:forEach>
        <page:pagination page="${page }" />
      </div>
      
	  <c:import url="/layout/right"/>
    </div>
  </div>
</div>
<c:import url="/layout/footer"/>
</body>
<script>
// 主菜单动画
$(function() {
    var easing = "linear";
    $(".head2 .nav li").each(function() {
        if ($(this).hasClass("active")) return;
        var w = $(this).find("a").width();
        var span = $(this).find("a>span");
        $(this).on({
            mouseenter: function() {
                if (span.css("right") == "auto") {
                    span.css("right", w + "px");
                };
                span.animate({
                    left: 0,
                    right: 0
                }, 300, easing);
            },
            mouseleave: function() {
                span.animate({
                    right: w
                }, 100, easing);
            }
        });
    });
});

</script>
</html>